{layout name="layout" /}

<style>
    #search .select-box {
        display: inline;
    }

    #search .select-box select {
        border: none;
    }
</style>

<div class="Hui-article">
    <div style="margin-left:20px; max-width: 90%; min-width: 800px;">
        <div class="pd-20">
            <div class="text-c">
                <form action="" method="GET" id='search'>
                    <!-- 日期范围：
                    <input type="date" id="logmin" class="input-text Wdate" style="width:150px;">
                    -
                    <input type="date" id="logmax" class="input-text Wdate" style="width:150px;"> -->
                    <span class="select-box">
                        <span>状态:</span>
                        <select id="status" name="status">
                            <option value="0" {notempty name="status"}{eq name='status' value="0" }selected{/eq}{/notempty}>全部 </option>
                            <option value="1" {notempty name="status"}{eq name='status' value="1" }selected{/eq}{/notempty}>正常 </option>
                            <option value="2" {notempty name="status"}{eq name='status' value="2" }selected{/eq}{/notempty}>下线 </option>
                        </select> 
                    </span>
                    <input type="text" name="title" id="title" value="{notempty name='title'}{$title}{/notempty}" placeholder=" 文章名称" style="width:250px" class="input-text">
                    <button name="" id="" class="btn btn-success" type="submit">
                    <i class="Hui-iconfont">&#xe665;</i> 搜文章</button>
                    <a href="{:url('/fun_article/index')}" class="btn btn-danger">清除条件</a>
                </form>
            </div>
            <div class="cl pd-5 bg-1 bk-gray mt-20">
                <span class="l">
                    <a href="javascript:;" onclick="del_all()" class="btn btn-danger radius">
                        <i class="Hui-iconfont">&#xe6e2;</i> 批量删除</a>
                    <a href="{:url('/fun_article/add')}" class="btn btn-primary radius">
                        <i class="Hui-iconfont">&#xe600;</i>添加文章</a>
                </span>
                <span class="r">
                    <a href="{:url('/fun_article/trash')}" class="btn btn-danger radius">
                        <i class="Hui-iconfont">&#xe6e2;</i>回收站</a>
                </span>
            </div>
            <div class="mt-20">
                <table class="table table-border table-bordered table-bg table-hover table-sort">
                    <thead>
                        <tr class="text-c">
                            <th width="20px">
                                <input type="checkbox" value="" name="allcheck">
                            </th>
                            <th width="50px">ID</th>
                            <th style="min-width: 160px;">文章标题</th>
                            <th width="160px">更新日期</th>
                            <th width="100px">状态</th>
                            <th width="80px">点击量</th>
                            <th width="100px">操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        {foreach $data as $val}
                        <tr class="text-c va-m">
                            <td>
                                <input type="checkbox" value="{$val.id}" name="checkbox[]">
                            </td>
                            <td>{$val.id}</td>
                            <td class="text-l">
                                <a href="javascript:void(0);" style="text-decoration:none" title="浏览">{$val.title}</a>
                            </td>
                            <td class="text-c">{$val.pubtime|date="Y-m-d H:i:s",###}</td>
                            <td class="td-status">
                                {eq name="val.status" value="1"}
                                <a href="javascript:void(0);" title="下线" data-value='{$val.status}' data-id='{$val.id}' data-field='status' class="top_status">
                                    <span class="label label-success radius">正常</span>
                                </a>
                                {else/}
                                <a href="javascript:void(0);" title="上线" data-value='{$val.status}' data-id='{$val.id}' data-field='status' class="top_status">
                                    <span class="label label-default radius">已下线</span>
                                </a>
                                {/eq}
                            </td>
                            <td>{$val.clicks}</td>
                            <td class="td-manage text-c">
                                <a href="javascript:;" title="文章详情" style="text-decoration:none" onClick="layer_show('文章详情','{:url(\'/fun_article/preview\', \'id=\'.$val.id)}')" class="ml-10">
                                    <i class="Hui-iconfont">&#xe685;</i>
                                </a>
                                <a href="{:url('/fun_article/edit', 'id='.$val.id)}" title="编辑" style="text-decoration:none" class="ml-10">
                                    <i class="Hui-iconfont">&#xe6df;</i>
                                </a>
                               
                                <a href="javascript:;" title="删除" style="text-decoration:none" class="ml-10" onClick="del(this,'{$val.id}')">
                                    <i class="Hui-iconfont">&#xe6e2;</i>
                                </a>
                            </td>
                        </tr>
                        {/foreach}
                    </tbody>
                </table>
            </div>
            <div class="cl pd-5 bg-1 bk-gray mt-20 ">
                <span class="l">共
                    <strong>{//$counts}</strong> 篇, {//$pages} 页 </span>
                <span class="r">
                    {$data->render()}
                </span>
            </div>
        </div>
    </div>
</div>

<!-- 请在下方写此页面业务相关的脚本 -->
<script type="text/javascript">
$('.top_status').click(function(){
    var data = $(this).data();
    var id = data.id;
    var field = data.field;

    var value = 2;
    var status = '已下线';
    var title = '上线';
    var color = 'default';
    if (data.value==2) {
        value = 1;
        status = '正常';
        title = '下线';
        color = 'success';
    }

    var obj = this;
    $.post('topstatus', {
        'id': id,
        'field': field,
        'value': value
    }, function (data) {
        if (data.code == 2) {
            $(obj).html('<span class="label label-'+color+' radius">'+status+'</span>');
            $(obj).data('value', value);
            $(obj).attr('title',title);
        } else {
            layer.msg('操作失败, 请稍后再试', {
                icon: 5,
                time: 1000
            });
        }
    }, 'json');
    return 0;
});
</script>
<!--/请在上方写此页面业务相关的脚本-->